<script>
import request from "@/utils/request";

export default {
  name: "Header",
  data(){
    return{
      paths:[
      ],
      user:localStorage.getItem("user") ? JSON.parse(localStorage.getItem("user")) : {},
      drawer: false,
      direction: 'rtl',
      tableData:[],
      balances:''
    }

  },
  props:{
  },
 methods: {
   getBalance() {
    console.log(this.user.id)
     request.post("/User/query", {
           pageNum: this.pageNum,
           pageSize: this.pageSize,
           id: this.user.id, 
         }
     ).then(res => {
      console.log(this.user.id)
       console.log(res)
       this.balances= res.data.balance
       this.total = res.data.total
     })
   }
 }
}
</script>

<template>
  <div class="headerView">
    <el-radio-group v-model="direction">>
    </el-radio-group>

    <el-button @click="getBalance();drawer = true" type="primary" style="margin-left: 18px;" circle >
    <span>{{user.type}}</span>
    </el-button>

    <el-drawer
        id="draw"
        title="账户信息"
        :visible.sync="drawer"
        :direction="direction">
      <p id="p">
      <span>账户类型: </span>
      <span>{{user.type}}</span><br/>
        <el-divider></el-divider>
        <span>账号: </span>
        <span>{{user.account}}</span><br/>
        <el-divider></el-divider>
      <span>账户余额: </span>
        <span>{{balances}}</span>
        <el-divider></el-divider>
      </p>
    </el-drawer>
  </div>
</template>

<style scoped>
#draw{font-size: 30px;font-style: normal; text-align: center}
#p{font-size: 15px;font-style: normal; text-align: center}

</style>